<template>
	<view>
		<!-- 全屏广告 -->
		<!-- <cover-view v-if="showFullScreenAd" class="full-screen-ad">
			<cover-view v-if="showFullScreenAd" class="sec" @tap="closeFullScreenAd">跳过{{ fullScreenAdShowSec }}s
			</cover-view>
			<cover-image v-if="showFullScreenAd" class="image" 
				:src="util.attachedUrl(fullScreenImage, baseurl)"
				data-type="fullScreen" :data-item="fullScreenAd" @tap="jumpTo"></cover-image>
		</cover-view> -->
		
		<view v-if="showFullScreenAd" class="full-screen-ad">
			<view v-if="showFullScreenAd" class="sec" @tap="closeFullScreenAd">跳过{{ fullScreenAdShowSec }}s
			</view>
			<image mode="aspectFill" v-if="showFullScreenAd"
			:src="util.attachedUrl(fullScreenImage, baseurl)"
				data-type="fullScreen" :data-item="fullScreenAd" @tap="jumpTo"></image>
		</view>
		<!-- 弹窗广告 -->
		<u-popup :show="showHomePopAd" mode="center" custom-style="background-color: transparent;align-items:center;">
			<view class="home-pop-ad">
				<image class="image" mode="widthFix" :src="util.attachedUrl(homePopImage, baseurl)" data-type="popup"
					:data-item="popupAd" @tap="jumpTo"></image>
				<!-- 关闭按钮 -->
				<view class="u-icon-box">
          <u-icon class="icon-cancel" name="close-circle" size="36" color="#fff" @tap="closeHomePopAd"></u-icon>
        </view>
			</view>
		</u-popup>
	</view>
</template>
<script module="util" lang="wxs" src="../../utils/util.wxs"></script>
<script type="text/javascript" >
	const app = getApp();

	let fullScreenAdTimer = null;
	import util from '../../utils/util';
	import {
		http
	} from '@/utils/commonRequest.js'
	export default {
		components: {},
		data() {
			return {
				baseurl: app.globalData.baseurl,
				fullScreenAd: null,
				// 全屏广告对象
				showFullScreenAd: false,
				// 是否显示全屏广告
				fullScreenImage: '',
				// 全屏广告图片
				fullScreenAdShowSec: 0,
				// 全屏广告显示时间
				popupAd: null,
				// 弹窗广告对象
				showHomePopAd: false,
				// 是否显示弹窗广告
				homePopImage: '' // 弹窗广告图片
			};
		},
		/**
		 * 组件的属性列表
		 */
		props: {},
		/**
		 * 组件的方法列表
		 */
		methods: {
			async getAdInfo() {
				let that = this;

				try {
					await http.get('/advertising/getAdvertisings').then((res) => {
						res = res.data
						if (200 == res.code) {
							console.log(res);

							if (res.fullScreenAd) {
								uni.hideTabBar();
								that.fullScreenAd = res.fullScreenAd
								that.showFullScreenAd = true
								this.$emit("getAdvertMes", this.showFullScreenAd, this.showHomePopAd)
								that.fullScreenAdShowSec = res.fullScreenAd.rsv1
								that.fullScreenImage = res.fullScreenAd.img
							}

							fullScreenAdTimer = setInterval(() => {
								let fullScreenAdShowSec = that.fullScreenAdShowSec;

								if (fullScreenAdShowSec === 0) {
									clearInterval(fullScreenAdTimer);
									that.showFullScreenAd = false
									this.$emit("getAdvertMes", this.showFullScreenAd, this.showHomePopAd)
									uni.showTabBar();
								} else {
									that.fullScreenAdShowSec = fullScreenAdShowSec - 1
								}
							}, 1000);

							if (res.popupAd) {
								if (res.popupAd.onOff == '0') {
									return;
								}

								that.popupAd = res.popupAd
								that.showHomePopAd = true
								this.$emit("getAdvertMes", this.showFullScreenAd, this.showHomePopAd)
								that.homePopImage = res.popupAd.img
							}
						} else {
							console.log(res);
						}
					});
				} catch (err) {
					console.log(err);
				}
			},

			/**
			 * 关闭全屏广告
			 */
			closeFullScreenAd() {
				this.showFullScreenAd = false
				this.$emit("getAdvertMes", this.showFullScreenAd, this.showHomePopAd)
				uni.showTabBar();
			},

			/**
			 * 关闭弹窗广告
			 */
			closeHomePopAd() {
				this.showHomePopAd = false
				this.$emit("getAdvertMes", this.showFullScreenAd, this.showHomePopAd)
			},

			/**
			 * 跳转到对应广告链接
			 * @param {跳转内容对象} obj
			 */
			jumpTo: function(e) {
				let obj = e.currentTarget.dataset.item;
				let type = e.currentTarget.dataset.type;
				if (obj) {
					if ('fullScreen' == type) {
						this.showFullScreenAd = false
					} else if ('popup' == type) {
						this.showHomePopAd = false
						
					}
					this.$emit("getAdvertMes", this.showFullScreenAd, this.showHomePopAd)
					uni.showTabBar();
					util.throttle(this.jumpFun(obj), 1500);
				}
			},
			jumpFun: function(obj) {
				if (obj.linkType) {
					let linkType = obj.linkType;
					let linkContent = obj.linkContent;
					if ('message' == linkType) {
						//配置的资讯软文,跳转到web-view页面
						let link = obj.rsv3;
						uni.navigateTo({
							url: '/pages/outlink/outlink?outlink=' + link
						});
					} else if ('activity1' == linkType) {
						//转盘抽奖"linkType":"activity1",
						//砸金蛋"linkType":"activity2",
						//星座抽奖"linkType":"activity4",
						uni.navigateTo({
							url: '/subPackages/lottery/pages/wheel/wheel?id=' + linkContent
						});
					} else if ('activity2' == linkType) {
						uni.navigateTo({
							url: '/subPackages/lottery/pages/goldenEgg/goldenEgg?id=' + linkContent
						});
					} else if ('activity4' == linkType) {
						uni.navigateTo({
							url: '/subPackages/lottery/pages/constellation/constellation?id=' + linkContent
						});
					} else if ('pageDictionary' == linkType) {
						let page = {
							isJump: 0,
							pageDictionary: JSON.parse(linkContent)
						};
						util.toBannerUrl(page);
					}
				}
			}
		},
		beforeMount: function() {
			// 在组件实例进入页面节点树时执行
		},
		destroyed: function() {
			// 在组件实例被从页面节点树移除时执行
		}
	};
</script>
<style>
	.full-screen-ad {
		width: 100vw;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 999999;
	}

	.full-screen-ad .image {
		/* width: auto;
		height: 100%; */
		
	}

	.full-screen-ad .sec {
		line-height: 50rpx;
		padding: 0 20rpx;
		font-size: 24rpx;
		border-radius: 20rpx;
		opacity: 0.6;
		position: absolute;
		right: 30rpx;
		bottom: 60px;
		color: #fff;
		background: #29300a;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 10;
	}

	.home-pop-ad {
		width: 500rpx;
		padding-bottom: 120rpx;
	}

	.home-pop-ad .image {
		width: 100%;
		max-height: 750rpx;
	}

	.icon-cancel {
		position: absolute;
		left: 50%;
		bottom: 0;
		transform: translateX(-50%);
	}
  
  .u-icon-box{
    width: 100%;
    display: flex;
    justify-content: center;
  }
</style>
